pin-dots {
  display: flex;
  justify-content: space-between;
  max-width: 145px;
  margin: 0 auto auto auto;
  width: 50%;
  padding-top: 33px;
  .circle {
    $circle-diameter: 18px;
    $transition-duration: 200ms;
    border-radius: 50%;
    transition: background-color $transition-duration ease,
      border $transition-duration ease;
    background-color: #d8d8d8;
    height: $circle-diameter;
    width: $circle-diameter;
  }
  .filled {
    background-color: $color-primary;
  }
}
